<%-- 
    Document   : ViewPoll
    Created on : 10/08/2011, 10:21:34 AM
    Author     : David Bullock 42062222
--%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ include file="../header.jsp" %>
<div id="content-container">
    <div id="content">
        <!-- Content goes here -->
        <c:if test="${set}">
            <h1 align ="center"><c:out value="${poll.getName()}"/></h1>
            <p><i>Use the Open and close buttons to set questions for web users, and the button below to start a live session</p></i>

            <div style="text-align: center">
                <button onclick="start(<c:out value="${pid}"/>);" value="start">Start Live Poll</button><br/>
                <input type="checkbox" value="false" onclick="show(checked);" onload="show(checked)" > Edit Poll
            </div>

            <div id="map" style="width: 650px; height: 300px;"></div>
            <input type="submit" onclick="returnCoords()" value="Set Location" id="mapButton"/>
            <div style ="color: red"><c:out value="${error}"/></div>

            <span id="days">
                <label> Timeout any questions you open after: </label>
                Days<input type="text" id="day" size="1"/> Hours<input type="text" id="hour" size="1"/>Minutes<input type="text" id="min" size="1"/>
                <br/>Or leave blank to keep the questions open until they're manually closed<div id="error" style="color: red"></div>

            </span>
            <span id="editList">
                <table width ="95%" border ="1" cellspacing="0" cellpadding="2">
                    <!-- for loop iterating through question list-->
                    <tr>
                        <th>Question</th>
                        <th>Type</th>
                        <th>Results viewable</br>
                            Click to swap</th>
                        <th>Open/Close</th>
                        <th>View Result</th>                    
                    </tr>
                    <c:forEach items="${questions}" var="quest">
                        <tr>
                            <td align ="center"><c:out value="${quest.getText()}"/></td>
                            <td align ="center"><c:out value="${quest.getStatus()}"/></td>           
                            <td align ="center">
                                <a href="./showPoll.html?pid=<c:out value="${pid}"/>&qid=<c:out value="${quest.getId()}"/>&public=<c:out value="${quest.isPublic()}"/>">
                                    <script> if (<c:out value="${quest.isPublic()}"/>==true) document.write("Public"); else document.write("Private"); </script>
                                </a>
                            </td>
                            <!-- Basically, this would read onclick="\""+button + "(" +quest.getId() + "\""/> button if it where in java                   -->
                            <td align ="center">
                                <c:choose>
                                    <c:when test="${quest.getStatus() == 'Open'}">
                                        <button onclick="Close(<c:out value="${quest.getId()}"/>)">Close</button></td>
                                    <td>&numsp;</td>
                                </c:when>
                                <c:otherwise>
                                <button onclick="Open(<c:out value="${quest.getId()}"/>)">Open</button>
                                </td>
                                <td>
                                    <c:choose>
                                        <c:when test="${quest.getStatus() == 'Close'}">
                                            <a href="/DbPoll/viewResults.html?pid=${pid}&qid=<c:out value="${quest.getId()}"/>">View Results</a>
                                        </c:when> 
                                        <c:otherwise>
                                            &numsp; </td>
                                    </c:otherwise>
                                </c:choose>
                                </td>                            
                            </c:otherwise>
                        </c:choose>
                        </td>
                        </tr>
                    </c:forEach>
                </table>
            </span>

            <span id="basicList">
                <table width ="95%" border ="1" cellspacing="0" cellpadding="2">
                    <!-- for loop iterating through question list-->
                    <tr>
                        <th>Question</th>
                        <th>Type</th>
                        <th>View Result</th> 
                    </tr>

                    <c:forEach items="${questions}" var="quest">
                        <tr>
                            <td align ="center"><c:out value="${quest.getText()}"/></td>
                            <td align ="center"><c:out value="${quest.getStatus()}"/></td> 
                            <td align ="center">
                                <c:if test="${quest.getStatus() == 'Close'}">
                                    <a href="/DbPoll/viewResults.html?pid=<c:out value="${pid}"/>&qid=<c:out value="${quest.getId()}"/>">View Results</a>
                                </c:if>  &numsp;               
                            </td>
                        </tr>
                    </c:forEach>

                </table>
            </span>
            <!-- Start of map thing.-->        


            <input type="text" name="latitude" id="lat" value="<c:out value = "${lat}"/>" hidden="true"/> 
            <input type="text" name="longitude" id="lon" value="<c:out value = "${lon}"/>" hidden="true"/>            

            <!-- add your map api key here -->
            <script type="text/javascript" src="http://maps.google.com/maps?file=api&v=2&key="></script>
            <script type="text/javascript">               
                function returnCoords(){                                     
                    var lon = document.getElementById("lon").value;
                    var lat = document.getElementById("lat").value;                      
                    window.location = "./showPoll.html?pid=<c:out value="${pid}"/>&lon="+lon+"&lat="+lat;                                           
                }                
                
                if (GBrowserIsCompatible()) {
                    // create map and add controls
                    var map = new GMap2(document.getElementById("map"));
                    var customUI = map.getDefaultUI();
                    customUI.controls.scalecontrol = false;
                    customUI.controls
                    map.setUI(customUI);
                    map.removeMapType(G_HYBRID_MAP);
                    
                    // set centre point of map
                    var centrePoint = new GLatLng('<c:out value = "${lat}"/>', '<c:out value = "${lon}"/>');
                    map.setCenter(centrePoint, 14);	
                    
                    // add a draggable marker
                    var marker = new GMarker(centrePoint, {draggable: true});
                    
                    map.addOverlay(marker);
                    
                    //enable the search bars
                    map.enableGoogleBar();
                    
                    // add a drag listener to the map
                    GEvent.addListener(marker, "dragend", function() {
                        var point = marker.getPoint();
                        map.panTo(point);
                        document.getElementById("lat").value = point.lat();
                        document.getElementById("lon").value = point.lng();
                    });
                }                    
            </script>


        </div>
    </div>

    <script lang="JavaScript">
        //the 3 button functions
        function start(id) {
            window.open("./live.html?pid="+id,"Press F11 to make full on other view", 'scrollbars=0, toolbar=0,location=0,directories=0,status=0,menubar=0');
            window.location= "./admin.html?pid="+id+"&item=item";
        }
        
        show(document.getElementById("days").checked);
        
        function show(checked){
            document.getElementById("days").hidden=!checked;
            document.getElementById("editList").hidden=!checked;
            document.getElementById("map").hidden=!checked;            
            document.getElementById("mapButton").hidden=!checked;            
            
            document.getElementById("basicList").hidden=checked;            
        }

        function Open(id){
            document.getElementById("error").innerHTML=""
            time = new Array()
            time[0]=document.getElementById("day").value
            time[1]=document.getElementById("hour").value
            time[2]=document.getElementById("min").value           
            //set them all to be zero if they are blank     
            
            for(i=0; i< time.length; i++){
                //(time[i]=="") ? time[i] = 0 : time[i] = time[i]
                if (time[i].split(".").length!=1)
                    document.getElementById("error").innerHTML+="The value \""+time[i]+"\" is invalid. There can not be decimals in these values</br>"
                if (isNaN(time[i])){
                    document.getElementById("error").innerHTML+="The value \""+time[i]+"\" is invalid. All values must be numbers</br>"}
            }
            if (document.getElementById("error").innerHTML=="") {
                seconds = time[0]*24*60*60 + time[1]*60*60+time[2]*60
                window.location="./showPoll.html?pid=<c:out value="${pid}"/>&qid="+id+"&seconds="+seconds
            }
        }

        function Close(id){            
            window.location="./showPoll.html?pid=<c:out value="${pid}"/>&qid="+id;
        }
    </script>

</c:if>
<c:if test="${set==false}">
    <p>The page is improperly formed. Try going back and trying again</p>
</c:if>
<%@ include file="../footer.jsp" %>
